<template>
  <div class="parent">
    <p>
      在自定义组件上使用v-mode或者.sync到底是为什么了？？？ <br>
      是父子组件之间实现数据的双向绑定
    </p>
    <p>这是父组件显示的值：{{message}}</p>
    <Son v-model="message"></Son >
    <!--<Son :value="message" @input="message = $event"></Son>-->
    <p>
      v-model其实就是语法糖，就是以上注释代码的缩写<br>
      v-model默认接收的props是value，触发的是input事件<br>
      但是有时候我们并不想要默认：比如在子组件中props: ['value'],和this.$emit('input', e.target.value);<br>
      我们想要定制prop 和 event
    </p>
  </div>
</template>
<script>
import Son from './son.vue'
export default {
  components: {
    Son
  },
  data () {
    return {
      message: ''
    }
  }
}
</script>

